<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<link th:href="@{/css/bootstrap.css}" rel="stylesheet">
<script src="/js/jquery-1.8.2.min.js"></script>
<script src="/js/npm.js"></script>
<script src="/layer/layer.js"></script>
<!--<link rel="stylesheet" th:href="/layer/mobile/need/layer.css">-->
<script>
    function fenye(page){
        $("#current").val(page);
        $("#myform").submit();
    }

    function plsc(){
        var id = $("[name=ck]:checked").map(function(){
            return $(this).val();
        }).get().join(",");
        alert(id);

        $.post(
            "delete",
            {id:id},
            function(obj){
                if(obj){
                    alert("cg");
                    location="list"}
                    else{
                        alert("sb")}
            },"json"
        );
    }
</script>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
<body>
<div class="container">
   <form action="list" method="post" id="myform">
       <input type="hidden" id="current" name="current" th:value="${p .size}">
       姓名：<input type="text" name="mohu" th:value="${mohu}" />
       <input type="submit" value="查询" />
    <button onclick="add()" class="btn btn-prim">添加</button>
    </form>
    <table  id="table table-striped table-bordered table-hover table-condensed text-center" class="table">
        <thead>
        <tr>
            <td>
                <input value="删除" type="button" th:onclick="'javascript:plsc()'" class="btn btn-warning">
            </td>
            <td>
                商品名称
            </td>
            <td>
                商品状态
            </td>
            <td>
                创建时间
            </td>
            <td>
                商品图
            </td>
            <td>
                操作
            </td>
        </tr>
        </thead>
        <tbody>
        <tr th:each="i : ${p.list}">
            <td >
                <input type="checkbox" th:value="${i.id}" name="ck">
            </td>
            <td th:text="${i.title}">
                商品名称 title
            </td>
            <td th:text="${i.status} == 0 ? '未启用': '已启用'">
                商品状态 status
            </td>
            <td th:text="${#dates.format(i.createTime, 'yyyy-MM-dd')}">
                创建时间 createTime
            </td>
            <td>
                <img th:src="${i.image}" alt="" th:width="35px" th:height="40px">
            <td colspan="11"><input type="button" value="修改" th:onclick="'javascript:update('+${i.id}+')' "  class="btn btn-warning">
            </td>
        </tr>
        </tbody>
        <td colspan="11">
            当前页:[[${p.pageNum}]]/ 总页数:[[${p.pages}]] 总条数:[[${p.total}]]
            <input type="button" value="首页"  th:onclick="'javascript:fenye(1)'"/>
            <input type="button" value="上一页" th:onclick="'javascript:fenye('+${p.prePage}+')'"/>
            <input type="button" value="下一页" th:onclick="'javascript:fenye('+${p.nextPage}+')'"/>
            <input type="button" value="末页"  th:onclick="'javascript:fenye('+${p.pages}+')'"/>

        </td>
    </table>
</div>

</body>
<script>
    function add() {
        layer.open({
            type: 1,
            area: ['600px', '360px'],
            maxin: true,
            fixed: false,
            content: 'add'
        });
    }
        function update(id){
            layer.open({
                type: 2,
                area: ['600px', '360px'],
                shadeClose: true, //点击遮罩关闭
                content: 'update?id='+id
            });
    }
</script>
</html>